<div class="breadcrumbs breadcrumbs-fixed"
     id="breadcrumbs">
    <script type="text/javascript">
        try {
            ace.settings.check('breadcrumbs', 'fixed')
        } catch (e) {
        }
    </script>

    {% if entity.entity_type == 'Task' or entity.entity_type == 'Asset'or entity.entity_type == 'Shot'or entity.entity_type == 'Sequence' %}
        {% include 'breadcrumb/breadcrumbs_task.jinja2' %}
    {% elif entity.entity_type == 'Ticket' %}
        {% include 'breadcrumb/breadcrumbs_ticket.jinja2' %}
    {% elif entity.entity_type == 'Version' %}
        {% include 'breadcrumb/breadcrumbs_version.jinja2' %}
    {% else %}
        {% include 'breadcrumb/breadcrumbs_base.jinja2' %}
    {% endif %}

    <div class="nav-search" id="nav-search">
        <form class="form" onsubmit="javascript:submitForm();return false;">
        <span class="input-icon">
        <input type="text" placeholder="Search ..."
               class="input-block-level"
               id="nav-search-input">
        <i class="icon-search nav-search-icon"></i>
        </span>
        </form>
    </div>
    <!--#nav-search-->
</div>

<script src='{{ request.static_url("stalker_pyramid:static/ace/js/chosen.jquery.min.js") }}'></script>

<script type="text/javascript">

    function submitForm() {
        var search_input = $("#nav-search-input");
        var search_str = search_input.val();

        $.getJSON('/submit_search', {str: search_str, id:'{{entity.id}}'}).then(function (data) {
            window.location.assign(data.url);
        });

    }
    $(document).ready(function () {
        var search_input = $("#nav-search-input");
        search_input.typeahead({source: [], updater: function (b) {
            search_input.focus();
            return b
        }});

        search_input.on('keyup', function () {
            var search_str = search_input.val();

            if (search_str.length > 3) {
                $.getJSON('/search', {str: '%'+search_str+'%'}).then(function (data) {

                    var input_source = [];
                    for (var i = 0; i < data.length; i++) {
                        input_source.push(data[i].name);
                    }

                    search_input.autocomplete({
                        delay: 0,
                        source: input_source,
                        minLength: 0
                    });
                });
            }
        })
    });
</script>
